<template>
  <basic-container>
    <h3>表格例子</h3>
    <avue-crud :option="option" :page.sync="page" :data="data" />
  </basic-container>
</template>

<script>
export default {
  data() {
    return {
      page: {
        total: 122,
      },
      data: [
        {
          username: "smallwei",
          name: "avue",
          password: "123456",
          newpassword: "123456",
          date: "2019-01-01",
          textarea: "这是一条很长很长很长很长很长很长很长很长的个性签名",
        },
        {
          username: "smallwei",
          name: "avue",
          password: "123456",
          newpassword: "123456",
          date: "2019-01-01",
          textarea: "这是一条很长很长很长很长很长很长很长很长的个性签名",
        },

        {
          username: "smallwei",
          name: "avue",
          password: "123456",
          newpassword: "123456",
          date: "2019-01-01",
          textarea: "这是一条很长很长很长很长很长很长很长很长的个性签名",
        },
        {
          username: "smallwei",
          name: "avue",
          password: "123456",
          newpassword: "123456",
          date: "2019-01-01",
          textarea: "这是一条很长很长很长很长很长很长很长很长的个性签名",
        },
        {
          username: "smallwei",
          name: "avue",
          password: "123456",
          newpassword: "123456",
          date: "2019-01-01",
          textarea: "这是一条很长很长很长很长很长很长很长很长的个性签名",
        },
        {
          username: "smallwei",
          name: "avue",
          password: "123456",
          newpassword: "123456",
          date: "2019-01-01",
          textarea: "这是一条很长很长很长很长很长很长很长很长的个性签名",
        },
        {
          username: "smallwei",
          name: "avue",
          password: "123456",
          newpassword: "123456",
          date: "2019-01-01",
          textarea: "这是一条很长很长很长很长很长很长很长很长的个性签名",
        },
      ],
      option: {
        column: [
          {
            label: "用户名",
            prop: "username",
            span: 14,
            row: true,
          },
          {
            label: "姓名",
            prop: "name",
            span: 14,
            row: true,
          },
          {
            label: "密码",
            prop: "password",
            type: "password",
            span: 14,
            row: true,
          },
          {
            label: "确认密码",
            prop: "newpassword",
            type: "password",
            hide: true,
            span: 14,
            row: true,
          },
          {
            label: "申请日期",
            prop: "date",
            type: "date",
            span: 14,
            row: true,
          },
          {
            label: "个性签名",
            prop: "textarea",
            type: "textarea",
            minRows: 8,
            span: 24,
            overHidden: true,
            row: true,
            maxlength: 255,
            showWordLimit: true,
          },
        ],
      },
    };
  },
};
</script>

<style>
</style>
